<%--
  Created by IntelliJ IDEA.
  User: zhouyang
  Date: 2017/12/22
  Time: 下午10:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>JsonServlet测试</title>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/createXmlHttp.js"></script>
    <script type="text/javascript">
      function subM() {
          var xmlHttp = createXH();
          var jsonObj = {
              "name": "周阳",
              "age": 30,
              "family": [{"name": "father", "age": 65, "sax": "男"},
                  {"name": "mother", "age": 60, "sax": "女"},
                  {"name": "wife", "age": 25, "sax": "女"}
              ]
          };
          jsonObj=JSON.stringify(jsonObj);
          jsonStr="jsonObj="+jsonObj;

          jsonStr = encodeURI(jsonStr);
          jsonStr = encodeURI(jsonStr);   //必须要转2次
          var url = "<%=request.getContextPath()%>/Servlet/JsonServ";
          //通过Post方式打开连接
          xmlHttp.open("POST", url, true);
          //定义传输的文件HTTP头信息
          xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
          //发送POST数据
          xmlHttp.send(jsonStr);
          xmlHttp.onreadystatechange = function () {
              if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
                  document.getElementById("jsonOB").innerHTML = xmlHttp.responseText;
              }
          }
      }
    </script>
  </head>
  <body>
    <div id="jsonOB"></div>
    <button type="button" onclick="subM()">点击</button>

  </body>
</html>
